﻿@model IEnumerable<ETL.Business.Models.ProjectCategoryModel>
@{
    ViewBag.Title = "Engineer Time Logging";
}
<script type="text/javascript">

    $(document).ready(function () {


        // Hide category id column which is needed for ajax request
        $('#ajaxGridCategory thead tr th:first').css('display','none');
        $('#ajaxGridCategory tbody tr').each(
            function() {
                $('td:first',this).css('display','none');
            }
        );

        // Alert whether the project is suspended
        var suspendedAlert = '@ViewBag.SuspendedAlert';

        if (suspendedAlert != null && suspendedAlert!= "")
        {
            alert(suspendedAlert);
        }
    });

    $(function () {
        
        // Highlight hovered row
//        $('#ajaxGridCategory tbody tr').live('mouseover', function () {
//            $(this).addClass('clickable');
//        });
//        $('#ajaxGridCategory tbody tr').live('mouseleave', function () {
//            $(this).removeClass('clickable');
//        });
      
        // Ajax request when a row is clicked
        $('#ajaxGridCategory tbody tr').live('click', function () {
            
            // highlight selected row
            $('#ajaxGridCategory tbody tr').each(
                function() {
                    $(this).removeClass('selected');
                }
            );
            $(this).addClass('selected');

            // Get category id
            var currentCategoryId = $(this).find('td:first').text();
            // Ajax function
            $.ajax({
                url: "/EnTimeLog/GetTask",
                type: 'POST',
                data: { 
                        projectId: $("select#ddlProject").val()
                 },
                success: function (response) {
                    $("#ajaxGridTask").replaceWith(response)
                },
                error: function (xhr) {
                    alert("Error!");
                }
            });


        });
    });
</script>
<div id="ajaxGridCategory">
    <div class="well">
        @{
            var gridCategory = new WebGrid(
                Model,
                defaultSort: "Name",
                fieldNamePrefix: "gridCat_",
                canSort: false,
                canPage: false
                );

        }
        <div id="grid-category">
            @if (Model != null && Model.Count() > 0)
            {
                @gridCategory.GetHtml(
            tableStyle: "table table-hover",
                    //headerStyle: "webgrid-header",
                    //footerStyle: "webgrid-footer",
                    //alternatingRowStyle: "webgrid-alternating-row",
                    //selectedRowStyle: "webgrid-selected-row",
                    //rowStyle: "webgrid-row-style",
            columns: gridCategory.Columns(
                gridCategory.Column("CategoryId", "CategoryId", @<text>@item.CategoryId</text>),
                gridCategory.Column("Name", "Category", @<text>@item.Description</text>),
                gridCategory.Column("EstimatedHours", "Estimated Hrs", @<text>@item.EstimatedHours</text>),
                gridCategory.Column("PercentComplete", "Percent Complete", @<text>@item.PercentComplete</text>)
            ))
            }
        </div>
    </div>
</div>
